You Don't Know JS上卷Part1 Chapter2.词法作用域

Posted on   |   In ,   |     |   visitors

2.1 词法阶段

词法作用域是定义在词法阶段的作用域，是由写代码时将变量和块作用域写在哪里来决定的，所以在词法分析器处理代码时会保持作用域不变。（不考虑欺骗词法作用域情况下）

2.1.1 查找

  • 作用域查找会在找到第一个匹配的标识符时停止。

  • 遮蔽效应：在多层嵌套作用域中可以定义同名的标识符，内部的标识符会“遮蔽”外部的标识符。

  • 全局变量会自动变成全局对象的属性，可以间接的通过对全局对象属性的引用来访问。通过这种技术可以访问那些被同名变量所遮蔽的全局变量，但是非全局的变量如果被遮蔽了，无论如何都无法被访问到。

    1
    window.a

  • 词法作用域只由函数被声明时所处的位置决定。

  • 词法作用域查找只会查找一级标识符，比如a、b、c。对于foo.bar.baz，词法作用域只会查找foo标识符,找到之后，对象属性访问规则会分别接管对bar和baz属性的访问。

2.2 欺骗词法

欺骗词法作用域会导致性能下降。以下两种方法不推荐使用

2.2.1 eval

eval(..)函数可以接受一个字符串为参数，并将其中的内容视为好像在书写时就存在于程序中这个位置的代码。

1
2
3
4
5
6
7
function foo (str, a) {
    eval( str ); // 欺骗！
    console.log( a, b );
}

var b = 2;
foo( "var b = 3;", 1 ); // 1, 3

eval('var b = 3')会被当做本来就在那里一样来处理。

  • 非严格模式下，如果eval(..)中所执行的代码包含一个或多个声明，会在运行期修改书写期的词法作用域。上述代码中在foo(..)内部创建了一个变量b，并遮蔽了外部作用域中的同名变量。
  • 严格模式下，eval(..)在运行时有自己的词法作用域，其中的声明无法修改作用域。
1
2
3
4
5
6
7
function foo (str) {
    "use strict"; 
    eval( str ); 
    console.log( a ); // ReferenceError: a is not defined
}

foo( "var a = 2;" );
  • setTimeout(..)和setInterval(..)的第一个参数可以是字符串，会被解释为一段动态生成的函数代码。已过时，不要使用
  • new Function(..)的最后一个参数可以接受代码字符串（前面的参数是新生成的函数的形参）。避免使用
2.2.2 with

with通常被当做重复引用同一个对象中的多个属性的快捷方式，可以不需要重复引用对象本身。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var obj = {
    a: 1,
    b: 2,
    c: 3
};

// 单调乏味的重复“obj”
obj.a = 2;
obj.b = 3;
obj.c = 4;

// 简单的快捷方式
with (obj) {
	a = 3;
    b = 4;
    c = 5;
}

with可以将一个没有或有多个属性的对象处理为一个完全隔离的词法作用域，这个对象的属性会被处理为定义在这个作用域中的词法标识符。

这个块内部正常的var声明并不会被限制在这个块的作用域中，而是被添加到with所处的函数作用域中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function foo(obj) {
    with (obj) {
        a = 2;
    }
}

var o1 = {
    a: 3
};

var o2 = {
    b : 3
}

foo( o1 );
console.log( o1.a ); // 2

foo( o2 );
console.log( o2.a ); // undefined
console.log( a ); // 2 -- 不好，a被泄露到全局作用域上了！

上面例子中，创建了o1和o2两个对象。其中一个有a属性，另一个没有。在with(obj){..}内部是一个LHS引用，并将2赋值给它。

  • o1传递进去后，with声明的作用域是o1,a = 2赋值操作找到o1.a并将2赋值给它。
  • o2传递进去后，作用域o2中并没有a属性，因此进行正常的LHS标识符查找，o2的作用域、foo(..)的作用域和全局作用域都没有找到标识符a，因此当a = 2执行时，自动创建了一个全局变量（非严格模式），所以o2.a保持undefined。
2.2.3 性能
  • JavaScript引擎会在编译阶段进行数项的性能优化，其中有些优化依赖于能够根据代码的词法进行静态分析，并预先确定所有变量和函数的定义位置，才能在执行过程中快速找到标识符。
  • 引擎在代码中发现eval(..)或with，它只能简单的假设关于标识符位置的判断都是无效的。因为无法在词法分析阶段明确知道eval(..)会接收到什么代码，这些代码会如何对作用域进行修改，也无法知道传递给with用来创建词法作用域的对象的内容到底是什么。
  • 悲观情况下如果出现了eval(..)或with，所有的优化可能都是无意义的，最简单的做法就是完全不做任何优化。代码运行起来一定会变得非常慢。

2.3 小结

词法作用域意味着作用域是由书写代码时函数声明的位置来决定的。

编译的词法分析阶段基本能够知道全部标识符在哪里以及是如何声明的，从而能够预测在执行过程中如何对它们进行查找。

有以下两个机制可以“欺骗”词法作用域：

  • eval(..)：对一段包含一个或多个声明的”代码“字符串进行演算，借此来修改已经存在的词法作用域（运行时）。
  • with：将一个对象的引用当做作用域来处理，将对象的属性当做作用域中的标识符来处理，创建一个新的词法作用域（运行时）。

副作用是引擎无法在编译时对作用域查找进行优化。因为引擎只能谨慎地认为这样的优化是无效的，使用任何一个都将导致代码运行变慢。不要使用它们